import React, { useEffect, useState } from 'react'
import { getList } from '../../hooks/use'
import { Tabs } from 'antd';
import type { TabsProps } from 'antd';
const Index = () => {
    const [list, setList] = useState([])
    console.log(list);

    const getlist = async () => {
        const res = await getList()
        setList(res.rows)
        console.log(res);

    }
    useEffect(() => {
        getlist()
    }, [])
    const onChange = (key: string) => {
        console.log(key);
    }
    const items: TabsProps['items'] = [
        {
            key: '1',
            label: '热搜榜',
            children: '↑热搜',
        },
        {
            key: '2',
            label: '北京榜',
            children: '↑北京',
        },
        {
            key: '3',
            label: '民生榜',
            children: '↑民生',
        },
        {
            key: '4',
            label: '财经榜',
            children: '↑财经',
        },
    ];
    return (
        <div>
            <Tabs defaultActiveKey="1" items={items} onChange={onChange} />
            <ul style={{ display: 'grid' }}>
                <li><span style={{ color: 'orange' }}>1</span>北京书记</li>
                <li><span style={{ color: '#e4ef4b' }}>2</span>阿迪达斯书萨达记</li>
                <li><span style={{ color: '#a9b41d' }}>3</span>阿萨是的</li>
                <li><span style={{ color: '#ccc' }}>4</span>啊手机号噶时间几点回家</li>
                <li><span style={{ color: '#ccc' }}>5</span>与额好的健康是福打火机科技扩大时</li>
                <li><span style={{ color: '#ccc' }}>6</span>萨顶顶夸稍等哈</li>
                <li><span style={{ color: '#ccc' }}>7</span>挨打是的吧代发UI</li>
                <li><span style={{ color: '#ccc' }}>8</span>阿斯顿撒撒打算</li>
            </ul>
        </div>
    )
}

export default Index
